@import "../include/css/functions";

#callout {
    background-image: url(../include/img/notepaper_bg_colored.jpeg);
    background-position: center center;
}

@form-width: 50%;
@textarea-min-height: 10em;

#content .container { text-align: center; }

#contact {
    
    table {
        width: @form-width;
        margin: 0px;
        margin: 0px auto;
        padding: 0px;
        border-collapse: collapse;
    }
    
    td, th {
        text-align: left;
        padding: .75 * @font-size;
    }
    
    td:first-child, th:first-child {
        padding-left: 0px;
    }
    
    input[type="text"], textarea {
        width: 100%;
        font-family: @font-stack;
        padding: .5em;
        color: rgba(0,0,0,.6);
        border: solid 1px #ccc;
        font-size: .9 * @font-size;
        -webkit-transition-property: color, border;
        -webkit-transition-duration: .5s;
    }
    
    input[type="text"]:focus, textarea:focus {
        color: rgba(0,0,0,.9);
        border: solid 1px #c00;
    }
    
    th {
        text-transform: uppercase;
        color: rgba(0,0,0,.6);
        letter-spacing: -0.06em;
        font-weight: bold;
        font-size: .9em;
        padding-bottom: 0px;
    }
    
    textarea {
        min-height: @textarea-min-height;
        line-height: 1.4em;
    }
    
    table:last-child tr:last-child td {
        text-align: right;
        padding-right: 0px;
    }
    
    input[type="submit"] {
        margin: 0px;
        padding: .5em 1em;
        font-family: @font-stack-alt;
        border: solid 1px transparent;
        font-size: 1.25em;
        .gradient(#900,#c00);
        color: #fff;
        .round(.5em);
        .shadow(0px,1px,3px,rgba(0,0,0,.4));
    }
}